import React,{ useEffect } from 'react'
import { View,Text,Image,Button } from '@tarojs/components'
import './index.less'
import Taro,{ useDidShow } from '@tarojs/taro';
import { Store } from '@/store/core.store';
import UserStore from '@/store/user.store';
const baseCls = `legions-branch-detail`;
import dayjs from 'dayjs'
import { routers } from '@/router';
import get from 'lodash/get';
import BranchStore from '@/store/branch.store';
import { branchService } from '@/api/branch.service';
export default function BranchDetail() {
    const user_store = Store.getStore(UserStore)
    const store = Store.getStore(BranchStore)
    useDidShow(() => {
        user_store.authentication();
    })
    useEffect(() => {
        return () => {
            store.setDetail(null);
        }
    },[])
    const onApproved = () => {
        if (store.isDisabledApproved) {
            return;
        }
        Taro.showModal({
            title: '同意',
            content: '分支申请审批通过',
            success: async function (res) {
                if (res.confirm) {
                    const result = await branchService.checkout(store.detail?._id as string)
                    if (get(result,'success')) {
                        Taro.showToast({
                            title: get(result,'message'),
                            icon: 'success',
                            duration: 2000,
                            success: () => {
                                Taro.navigateTo({
                                    url: routers.branch
                                })
                            }
                        })
                    } else {
                        Taro.showToast({
                            title: get(result,'message'),
                            icon: 'error',
                            duration: 2000,
                        })
                    }
                }
            }
        })
    }
    const onReject = () => {
        if (store.isDisabledReject) {
            return;
        }
        Taro.showModal({
            title: '驳回',
            content: '分支申请驳回',
            success: async function (res) {
                if (res.confirm) {
                    const result = await branchService.reject(store.detail?._id as string)
                    if (get(result,'success')) {
                        Taro.showToast({
                            title: '驳回成功',
                            icon: 'success',
                            duration: 2000,
                        })
                        Taro.navigateTo({
                            url: routers.branch
                        })
                    } else {
                        Taro.showToast({
                            title: '驳回失败,请重试',
                            icon: 'error',
                            duration: 2000,
                        })
                    }
                }
            }
        })
    }
    const onDelete = () => {
        if (store.isDisabledDelete) {
            return;
        }
        Taro.showModal({
            title: '删除',
            content: '分支申请删除',
            success: async function (res) {
                if (res.confirm) {
                    const result = await branchService.delete(store.detail?._id as string)
                    if (get(result,'success')) {
                        Taro.showToast({
                            title: '删除成功',
                            icon: 'success',
                            duration: 2000,
                        })
                        Taro.navigateTo({
                            url: routers.branch
                        })
                    } else {
                        Taro.showToast({
                            title: '删除失败,请重试',
                            icon: 'error',
                            duration: 2000,
                        })
                    }
                }
            }
        })
    }
    return (
        <View className={baseCls}>
            <View className='panel__content'>
                <View className='content'>
                    <Text className='title'>
                        分支名称：{store.detail?.branch_name}
                    </Text>
                    <Text className='li'>
                        仓库名称：{store.detail?.repository_name}
                    </Text>
                    <Text className='li'>
                        基线分支：{store.detail?.source_branch}
                    </Text>
                    <Text className='li'>
                        分支用途：{store.detail?.branch_usage}
                    </Text>
                    <View className={`icon ${store.audit_status_icon[store.detail?.audit_status as string]}`}></View>
                </View>
                <View className='content'>
                    <View className='li'>
                        <View className='name'>
                            <Text className='text'>{store.detail?.creator}</Text>
                        </View>
                        <View className='direction'><Image className='image' src='https://hoolinks-frontend-resources.oss-cn-shenzhen.aliyuncs.com/images/weapp-to.png'></Image></View>
                        <View className='name'>
                            <Text className='text'>{store.detail?.assign_members}</Text>
                        </View>
                    </View>
                    <Text className='li'>
                        申请时间：{dayjs(store.detail?.create_time).format('YYYY-MM-DD HH:mm:ss')}
                    </Text>
                    <Text className='li'>
                        处理时间：{store.detail?.audit_status === '1' ? dayjs(store.detail?.update_time).format('YYYY-MM-DD HH:mm:ss') : ''}
                    </Text>

                </View>


            </View>
            <View className='bottom'>
                <Button className={`button ${store.isDisabledDelete?'disabled':''}`} disabled={store.isDisabledDelete} style={{ color: '#FF2A2A',border: '1px solid #FF2A2A' }} onClick={onDelete}>删除</Button>
                <Button className='button disabled' style={{ color: '#108DE9',border: '1px solid #0E8FE9' }} disabled >查看</Button>
                <Button className={`button ${store.isDisabledReject?'disabled':''}`} disabled={store.isDisabledReject} style={{ color: '#FF9D00',border: '1px solid #FF9D00' }} onClick={onReject}>驳回</Button>
                <Button className={`button ${store.isDisabledApproved?'disabled':''}`} disabled={store.isDisabledApproved} style={{ color: '#FFFFFF',background: '#0E8FE9' }} onClick={onApproved}>通过</Button>
            </View>
        </View>
    )
}
